<template>
	<!-- 消息通知详情 -->
	<view>
		<!-- #ifdef APP-PLUS -->
		<view class="status_bar"></view>  
		<!-- #endif -->
		<navbar title="消息通知"></navbar>
		<view class="msg">
			<view class="msg_title">{{message.title}}</view>
			<view class="line"></view>
			<view class="msg_main">
				<view class="msg_main_content">
					<rich-text :nodes="message.content"></rich-text>
				</view>
				<view class="msg_main_time">{{message.create_time}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:0,
				message:{
					id:'',
					title:'',
					content:'',
					create_time:'',
					status:''//消息状态 1未读 0已读
				},
			}
		},
		onLoad(options) {
			this.id = options.id;
			this.getMessagedetail();
		},
		methods: {
			//获取消息列表
			getMessagedetail(){
				this.$api.messagedetail({id:this.id}).then(res=>{
					this.message = res;
				})
			}
		}
	}
</script>

<style lang="scss">
page{
	padding: calc(var(--status-bar-height) + 100rpx) 0 30rpx;
}
.messageread{
	font-size: 24rpx;
	font-family: Source Han Sans CN;
	font-weight: 400;
	color: #FFFFFF;
	position: absolute;
	right: 120rpx;
	transform: translateY(5rpx);
}
.messagedel{
	font-size: 24rpx;
	font-family: Source Han Sans CN;
	font-weight: 400;
	color: #FFFFFF;
	position: absolute;
	right: 30rpx;
	transform: translateY(5rpx);
}
.msg{
	width: 690rpx;
	background: #FFFFFF;
	border-radius: 10rpx;
	padding: 30rpx;
	margin: 30rpx 30rpx 0;
	
	&_title{
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: bold;
		color: #333333;
	}
	&_main{
		
		&_content{
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #666666;
			text-indent: 2em;
		}
		&_time{
			font-size: 24rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #666666;
			text-align: right;
			margin-top: 35rpx;
		}
	}
	.line{
		width: 630rpx;
		height: 1rpx;
		background: #E5E5E5;
		margin: 26rpx 0;
	}
}
</style>
